<template>
  <el-dialog :title="dialogProps.title" :visible.sync="dialogProps.visible" width='600px'  :fullscreen = 'Global.currentDevice'  align='center'>
        <el-divider></el-divider>
        <el-image :src="src" class='bg-ccc '  ></el-image>
        <!-- <img :src="src" class='bg-ccc '> -->
        <el-row class='mt12'>
          <el-form  label-width="120px" align='left'  >
                  <el-col  :xs='24' :lg='12'>
                            <el-form-item label="姓名：">{{form.name}}</el-form-item>
                            <el-form-item label="性别：">{{form.gender | userGender}}</el-form-item>
                            <el-form-item label="登录名：">{{form.loginName}}</el-form-item>
                            <el-form-item label="邮箱：">{{form.mail}}</el-form-item>
                            <el-form-item label="手机号：">{{form.mobile}}</el-form-item>
                  </el-col>
                  <el-col  :xs='24' :lg='12'>
                            <el-form-item label="职位：">{{form.position | userPosition}}</el-form-item>
                            <el-form-item label="角色：">{{roles}}</el-form-item>
                            <el-form-item label="标签：">{{tags}}</el-form-item>
                            <el-form-item label="部门：">{{form.officeName}}</el-form-item>
                            <el-form-item label="工号：">{{form.num}}</el-form-item>
                  </el-col> 
                </el-form>
        </el-row>
        <div slot="footer" class="dialog-footer">
              <el-button type="primary" @click="dialogProps.visible=false">确 定</el-button>
        </div>
  </el-dialog>
</template>

<script charset="utf-8" type="text/javascript">
  /*接口*/
import { getUserDetail}  from  '@/api/user/index'
export default {
  name: 'CheckUserList',
  data() {
    return {
      loading: false,
      //dialogo基本信息  显示隐藏状态  title 
      dialogProps: {
        visible: false,
        action: '',
        title: '用户信息'
      },
      form:{

      },
      roles:'',//用户对应角色
      tags:'',

      src:'static/img/user/icon-default-user.png'
    }
  },
  created(){
    
    
  },
  methods: {
    
  },
  mounted: function() {
    this.$nextTick(() => {
      this.$on('opencheck', function(data) {
        this.dialogProps.title = '用户信息'
        this.dialogProps.visible = true
        this.form=data
        // console.log(this.form.officeName)
        getUserDetail(data.code).then(res=>{
           // 
           if(res.data.flag == true){

                let rolearr = res.data.data.roles
                //角色回填
                this.roles = ''
                rolearr.forEach((item)=>{
                  this.roles += item.name
                })

                //标签回填
                this.tags=''
                // let tagsarr = res.data.data.tagArray
                // if(this.form.tags.length !=0 ){
                //     tagsarr.forEach((item)=>{
                //       this.tags += item.tagName
                //     })
                //     // this.tags=this.form.tags.slice(0,-1).split(',')
                //     // console.log(this.tags)  注意回填写在请求里面！！！！！
                // }
           }
          

        })
        
      })
      
    })
  },
  updated(){
    
  },
  components:{
    
  }
}
</script>

<style  scoped>

</style>


